<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@ taglib uri="http://www.springframework.org/tags" prefix="spring"%>
<%@ taglib uri="http://www.springframework.org/tags/form" prefix="form"%>
<div class="box m">
	<div class="btitle path">
		<a href="goHomePage.html"><spring:message code="top.header.homepage" /></a>&nbsp;»&nbsp; <a><spring:message code="page.header.viewcart" /></a>
	</div>
	<div class="bCt productLs">
		<div class="m3" style="padding-left: 0px;">
			<div class="clearfix">
				<div class="roundBoxBody">
					<div class="text-main">
						<br>
						<table class="cart" cellpadding="5" cellspacing="1">
							<tbody>
								<tr>
									<th width="35"><spring:message code="cart.item" /></th>
									<th width="200"><spring:message code="cart.product.name" /></th>
									<th width="60"><spring:message code="cart.product.image" /></th>
									<th width="70"><spring:message code="cart.product.quantity" /></th>
									<th width="130"><spring:message code="cart.product.unit.price" /></th>
									<th width="130"><spring:message code="cart.product.total.price" /></th>
								</tr>
								<c:forEach var="p" items="${sessionScope.CART_SESSION.products}" varStatus="i">
									<tr>
										<td align="center"><c:out value="${i.index}" /></td>
										<td style="padding-left: 5px;"><c:out value='${p.name}' /></td>
										<td align="center"><img style="max-height: 50px;" src="loadImage.html?type=THUMB&fileId=${p.productImages[0]}" width="50"></td>
										<td class="tal">${p.quantity }</td>
										<td class="tal"><font color="red">${p.getUnitPriceAsSale()}</font></td>
										<td class="tal"><font color="red">${p.getTotalPriceAsSale()}</font></td>
									</tr>
								</c:forEach>
								<tr>
									<td colspan="5" style='padding: 5px; color: #333;' align="right" height="30px"><b><spring:message code="cart.total.payment" /><font
											color="red">${sessionScope.CART_SESSION.getTotalPriceAsSale()}</font></b></td>
								</tr>
							</tbody>
						</table>
						<br>

						<div style="clear: both; background: #ffe4dd; padding: 5px; color: #b52427; text-align: left;">
							<strong><spring:message code="cart.checkout.patron.info" /></strong>
						</div>

						<form:form name="check_form" id="signupForm" method="post" action="confirmOrder.html" commandName="patronInfo" onsubmit="return validateForm();">
							<table class="tbl bgLLGray bdLGray wf mt10 pb20 guimail">
								<tbody>
									<tr>
										<th class="w160 vam"><spring:message code="cart.checkout.patron.name" /></th>
										<td><form:input value="" name="fullName" id="fullName" type="text" path="fullName" /></td>
									</tr>
									<tr>
										<th><spring:message code="cart.checkout.patron.email" /></th>
										<td><form:input value="" name="email" id="email" type="email" path="email" /></td>
									</tr>
									<tr>
										<th><spring:message code="cart.checkout.patron.phone" /></th>
										<td><form:input value="" name="phone" id="phone" type="phone" path="phone" /></td>
									</tr>
									<tr>
										<th><spring:message code="cart.checkout.patron.address" /></th>
										<td><form:textarea name="address" id="address" path="address"></form:textarea></td>
									</tr>
									<tr>
										<th><spring:message code="cart.checkout.patron.remark" /></th>
										<td><form:textarea name="remark" id="remark" path="remark"></form:textarea></td>
									</tr>
									<tr>
										<th><spring:message code="cart.checkout.patron.payment.method" /></th>
										<td><form:select name="paymentId" id="paymentId" path="paymentId">
												<c:forEach items="${paymentList}" var="pm">
													<form:option value="${pm.id}">
														<c:out value='${pm.name }' />
													</form:option>
												</c:forEach>
											</form:select></td>
									</tr>
								</tbody>
							</table>
							<div class="pt20 tar" style="padding-bottom: 15px; padding-top: 0px !important; padding-left: 230px;" align="left">
								<input class="button ml15" value="<spring:message code="cart.checkout.confirm"/>" id="btnPlaceOrder1" type="submit" /> <input class="button ml15"
									value="<spring:message code="cart.checkout.back"/>" id="btnPlaceOrder1" onclick="history.go(-1);" type="button" />
							</div>
						</form:form>
					</div>
				</div>
			</div>
			<div class="clearfix"></div>
		</div>
	</div>
</div>
<script type="text/javascript">
	function validateForm() {
		if ($('#fullName').val() == "") {
			$('#fullName').css('border-color', 'red');
			return false;
		} else {
			$('#fullName').css('border-color', '');
		}
		if ($('#address').val() == "") {
			$('#address').css('border-color', 'red');
			return false;
		} else {
			$('#address').css('border-color', '');
		}
		if ($('#email').val() == "" && !validateEmail($('#email').val())) {
			$('#email').css('border-color', 'red');
			return false;
		} else {
			$('#email').css('border-color', '');
		}

		if ($('#phone').val() == "") {
			$('#phone').css('border-color', 'red');
			return false;
		} else {
			$('#phone').css('border-color', '');
		}
		return true;
	}

	function validateEmail(email) {
		var re = /^(([^<>()[\]\\.,;:\s@\"]+(\.[^<>()[\]\\.,;:\s@\"]+)*)|(\".+\"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
		return re.test(email);
	}
</script>